<template>
	<view :class="{bg141414:theme}" style="min-height: 100vh;">

		<view class="con pb200">
			<back title="确认订单"></back>
			<view :class="theme?'bg292929 colorfff':'bgF5F6F7'" class=" pg30-30 borderE1E1E1 ra20">
				<view class="flex-a-i ">
					<image mode="" class="wh150-150 ra20 image" :src="info.thumb"></image>
					<view class="ml15">
						<view class="bold size30">{{info.title}}</view>
						<view class="size22  flex">
							<view :class="theme?'bg292929 colorfff':'bgfff'" class=" mt10 mb10  color999">
								{{is_box==1?'盲盒':'数字藏品'}}
							</view>
						</view>
						<view class="size42 bold">
							<text class="size24">¥ </text> {{info.money_price / 100}}
						</view>
					</view>
				</view>

				<view class="flex-ju-b mt30 " style="border-top:1px #E1E1E1 dashed">
					<view class="pt30 color999">购买数量</view>
					<view :class="theme?'bg141414 colorfff':'bgfff'" class="flex-a-i  center ra30">
						<view @click="tapnumebrs(1)" class="wh48-48 flex-ju-c">-</view>
						<view>
							<input class="width95 " :class="theme?' colorfff':'color000'" v-model="number" />
						</view>
						<view @click="tapnumebrs(2)" class="wh48-48 flex-ju-c ">+</view>
					</view>
				</view>
				<view class="flex-ju-b mt40">
					<view class="color999">合并价格</view>
					<view class="color333">
						¥{{(info.money_price *number) / 100 }}
					</view>
				</view>

			</view>
			<view :class="theme?'bg292929 colorfff':'bgF5F6F7'" class="borderE1E1E1 pg30-30 ra20 mt25">
				<view class=" size30 bold">支付选择</view>
				<view class=" mt40 ">
					<view v-if="hidden != 1" class="flex-ju-b   mt40">
						<view>汇付天下</view>
						<view v-if="walletStatus.HF" :style="{border:theme?'1px solid #FF6E44' :''}"
							class="da wh28-28 border000 ra28 flex-ju-c">
							<view :style="{background:theme?'#FF6E44' :''}" class="xiao wh15-15 ra15 bg000"></view>
						</view>
						<view class="srgb size24 pg10-20 ra10" v-else @click="tapmoney">
							开通钱包
						</view>
					</view>

					<view v-else class="flex-ju-b   mt40">
						<view>Apple</view>
						<view class="da wh28-28 border000 ra28 flex-ju-c">
							<view class="xiao wh15-15 ra15 bg000"></view>
						</view>
					</view>

				</view>



			</view>
			<view :class="theme?'bg292929 colorfff':'bgF5F6F7'" class="borderE1E1E1 pg30-30 ra20 mt25">
				<view class="bold">说明</view>
				<view class="color999 size26">
					<view class="mt15">1. 一个用户同时允许存在一笔待支付订单</view>
					<view class="mt10"> 2. 若您短时间未支付违约订单过多，将会被禁止购买一段时间</view>
				</view>
				<view class="bold mt30">购买须知</view>
				<view class="color999 size26">
					<view class="mt15">
						数字藏品交易仅限于20周岁(不含)以上、60周岁(含)以下，并已完成实名认证的中国大陆用户购买。由于不同属性的数字艺术有不同的二次交易规则，请您仔细阅读并同意相关规则后再进行相应操作，以避免不必要的损失。
						<view class="mt30">
							请注意，一旦数字藏品完成出售，不支持退货在购买之前，请仔细考虑您的购买决策。根据我国相关的法律要求，特定条件下的数字藏品的二次交易不支持任何形式的变相炒作。我们坚决反对数字藏品炒作、场外交易、欺诈，以及其他非法侵权行为。请您甄别上述涉嫌网络欺诈的行为并了解相关风险。
						</view>
					</view>
				</view>
			</view>
			<view class="flex-ju-c mt15">
				<view class="size24 flex-a-i color999">
					<radio style="transform:scale(0.7)" :borderColor="theme?'#FF6E44':'#000'" checked
						:activeBorderColor="theme?'#FF6E44':'#000'" :activeBackgroundColor="theme?'#FF6E44':'#000'" />
					我已阅读并同意<text @click.stop="navto('/pages/agreement?xieyis=1')" class="colorFF6E44">《服务协议》</text>
				</view>
			</view>

			<view class=" posifi width92vw bottom0 ">
				<view class="ra20 flex-ju-b pg30 bgfff height80"
					style="box-shadow: 0rpx -8rpx 24rpx 0rpx rgba(0,0,0,0.06);">
					<view class="bold size62  ">
						<text class="size31">¥ </text> {{(info.money_price *number) / 100 }}
					</view>
					<view @click="tapgoumai" class="bold wh330-100 bg000 colorfff ra20 flex-ju-c   size29  ">
						立即购买
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				hidden: uni.getStorageSync('hidden'),
				wallet: "HF",
				number: 1,
				info: {},
				walletStatus: {},
				theme: uni.getStorageSync('theme'),
				is_box: "",
				iap: {}
			}
		},
		onLoad(option) {
			this.http(`products/${option.uuid}`).then(res => {
				this.info = res.data.info
				this.is_box = res.data.is_box
			})

			this.http('wallet/walletStatus').then(res => {
				this.walletStatus = res.data
			})


			if (option.order_id) {
				this.http('order/check?order_id=' + option.order_id).then(ress => {
					if (ress.data.pay) {
						uni.reLaunch({
							url: "suu?order_id=" + e.order_id
						})
					} else {
						uni.showToast({
							title: "支付失败",
							icon: "none"
						})
					}
				})
			}
		},
		methods: {
			iostapgoumai() {
				var that = this
				var ids = ['art.huolian.wenchuang.666'];
				this.iap.requestOrder(ids, function(e) {

					that.http('/products/orders', {
						uuid: that.info.uuid,
						total: that.number,
						url: "pages/index/suu",
						wallet: 'APPLY'
					}, 'post').then(res => {

						var restoreFlag = true;
						plus.payment.request(that.iap, {
							productid: "art.huolian.wenchuang.666",
							manualFinishTransaction: true // 3.5.1+ 支持，设置此参数后需要开发者主动关闭订单，参见下面的关闭订单方法 finishTransaction()

						}, function(result) {

							console.log(result, "aaa")
							restoreFlag = false; // 支付成功清除标记 restoreFlag = false  
							// 支付成功，result 为 IAP商品交易信息对象 IAPTransaction 需将返回的支付凭证传给后端进行二次认证  

							this.http('products/applyPay', {
								order_no: res.data.order.pay_url,
								order_number: result
							}, 'post').then(res => {

								uni.showToast({
									title: "支付成功",
									icon: "none"
								})
							})


						}, function(e) {
							console.log(e, "ppp")
							uni.showToast({
								title: "支付失败",
								icon: "none"
							})
							// 支付失败 返回错误信息
						});

					})

				}, function(e) {
					uni.showModal({
						content: JSON.stringify(e)
					})
				});

			},
			tapmoney() {
				uni.navigateTo({
					url: '/pages/user/money'
				})
			},
			tapgoumai() {

				if (this.wallet) {
					var url = 'pages/index/suu'
					// #ifdef APP-PLUS
					url = "back.html?shoppay=1"
					// #endif
					this.http('products/orders', {
						uuid: this.info.uuid,
						total: this.number,
						url,
						wallet: this.wallet
					}, 'post').then(res => {
						this.topay(res.data.order.pay_url)
					}).catch(res => {
						if (res.data.code == 11000) {
							uni.showModal({
								content: res.data.message,
								success: (res) => {
									if (res.confirm) {
										this.navto('/pages/user/shiming/index')
									}
								}
							})
						}
					})
				} else {
					uni.showToast({
						title: "选择支付方式",
						icon: "none"
					})
				}
			},
			tapnumebrs(index) {
				if (index == 1) {
					if (this.number > 1) {
						this.number--
					}
				} else {
					this.number++
				}
			}
		}
	}
</script>

<style>

</style>